<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
	    <title>高颜值大咖测评团，WEY你而来！</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,shrink-to-fit=no">
	    <meta content="yes" name="apple-mobile-web-app-capable">
	    <meta content="black" name="apple-mobile-web-app-status-bar-style">
	    <meta content="telephone=no" name="format-detection">
	    <meta name="msapplication-tap-highlight" content="no">
	    <link rel="stylesheet" type="text/css" href="css/style.css"/>
	    <link rel="stylesheet" type="text/css" href="css/swiper.min.css"/>
	    <link rel="stylesheet" type="text/css" href="css/animate.min.css"/>
	</head>
	<script>
		var _hmt = _hmt || [];
		(function() {
		  var hm = document.createElement("script");
		  hm.src = "https://hm.baidu.com/hm.js?fdf0d2736b81bcae38aee0a100352a30";
		  var s = document.getElementsByTagName("script")[0]; 
		  s.parentNode.insertBefore(hm, s);
		})();
	</script>
	<body>
		<div class="swiper-container">
        <div class="swiper-wrapper" style="display:none">
        	<!--首页-->
            <div class="swiper-slide pageOne">	
            	<img src="img/one/deng.png" class="ani" swiper-animate-effect="flash" swiper-animate-duration="0.5s" swiper-animate-delay="0.8s"/>
            	<img src="img/one/font.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.5s" swiper-animate-delay="0.3s"/>
            	<img src="img/one/one-text01.png" class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.5s" swiper-animate-delay="0.3s"/>
            	<img src="img/one/one-text02.png" class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.5s" swiper-animate-delay="0.7s"/>
            	<img src="img/one-font.png"/>
            </div>
            <!--分类页面-->
            <div class="swiper-slide pageTwo">
            	<div class="movieDiv">
            		<!--<img src="img/sanjiao.png" class="sanjiao"/>
            		<img src="img/video.png" class="wai"/>-->
            		<video class="video" controls="controls"  x5-video-player-type="h5"  x5-video-player-fullscreen="true"    preload="auto"   poster="img/video.png">
            		<!--<video class="video"     poster="video/video.png"  x5-video-player-type="h5">  controls="controls"-->
            		<!--controls="controls"    loop="loop" playsinline webkit-playsinline    webkit-playshine="true"  x5-video-player-type="h5"  x5-video-player-fullscreen="true"-->
            		  <!-- controls="controls"-->
            		<source src="https://h5.xingyuanauto.com/video/changcheng01.mp4" type="video/mp4"></source>
            		当前浏览器不支持 video直接播放，点击这里下载视频： <a href="myvideo.webm">下载视频</a>
            		</video>
            	    <p class="ppp pop">*建议在WIFI环境下观看视频*</p>
            	</div>
            	
            	
            	<img src="img/shou/shiyan.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.3s" swiper-animate-delay="0.3s"/>
            	<img src="img/shou/shou-text.png" class="ani" swiper-animate-effect="fadeInDown" swiper-animate-duration="0.5s" swiper-animate-delay="0.5s"/>
            	<img src="img/shou/button01.png"  class="ani slide1" swiper-animate-effect="zoomIn" swiper-animate-duration="0.3s" swiper-animate-delay="1s"/>          	
            	<img src="img/shou/button02.png"  class="ani slide2" swiper-animate-effect="zoomIn" swiper-animate-duration="0.3s" swiper-animate-delay="1.3s"/>           	
            	<img src="img/shou/button03.png" class="ani slide3" swiper-animate-effect="zoomIn" swiper-animate-duration="0.3s" swiper-animate-delay="1.6s"/>
            </div>
            <!--内容匹配页面-->
            <div class="swiper-slide contentOne" id="go1">
            	<img src="img/kol/go-back.png" class="kol-back"/>
                <img src="img/kol/kol-text.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.4s" swiper-animate-delay="0.3s" />
                <img src="img/kol/kol-people01.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.4s" swiper-animate-delay="0.6s"/>
                <img src="img/kol/kol-text01.png" class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.4s" swiper-animate-delay="0.8s" />
                <img src="img/kol/kol-people02.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.4s" swiper-animate-delay="1s"/>
                <img src="img/kol/kol-text02.png" class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.4s" swiper-animate-delay="1.2s" />
                <img src="img/kol/kol-people03.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.4s" swiper-animate-delay="1.4s" />
                <img src="img/kol/kol-text03.png" class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.4s" swiper-animate-delay="1.6s" />
                <img src="img/kol/kol-people04.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.4s" swiper-animate-delay="1.8s" />
                <img src="img/kol/kol-text04.png" class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.4s" swiper-animate-delay="2s" />
                <img src="img/kol/biaoti.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.4s" swiper-animate-delay="0.3s" />
            </div>
            <!--车型亮点页面-->
            <div class="swiper-slide contentTwo" id="go2">
            		<img src="img/go-back.png" class="kol-back"/>
            		<img src="img/car-content/car-page01/up1.png" class="ani" swiper-animate-effect="zoomInRight" swiper-animate-duration="0.4s" swiper-animate-delay="0.3s" />
            		<img src="img/car-content/car-page01/up2.png" class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.4s" swiper-animate-delay="0.7s"/>
            		<img src="img/one-font.png"/>
            </div>
            <div class="swiper-slide contentTwo-2" >
            		<img src="img/car-content/car-page02/page02-text.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.4s" swiper-animate-delay="0.2s"  />
            		<img src="img/car-content/car-page02/page02-2.png" class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.4s" swiper-animate-delay="0.6s" />
            		<img src="img/car-content/car-page02/page02-text02.png" class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.4s" swiper-animate-delay="1s" />
            		<img src="img/car-content/car-page02/page02-3.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.3s" swiper-animate-delay="1.5s"  />
            		<img src="img/one-font.png"/>
            </div>
            <div class="swiper-slide contentTwo-3" >
            		<img src="img/car-content/car-page03/car-page-text01.png" class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.4s" swiper-animate-delay="0.2s"/>
            		<img src="img/car-content/car-page03/car-page02.png" class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.4s" swiper-animate-delay="0.6s" />
            		<img src="img/car-content/car-page03/car-page03.png" class="ani" swiper-animate-effect="rotateInDownRight" swiper-animate-duration="0.3s" swiper-animate-delay="1s" />
            		<!--<img src="img/car-content/car-page03/car-page-text02.png" class="ani" swiper-animate-effect="slideInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="1.3s" />-->
            		<img src="img/one-font.png"/>
            </div>
            <div class="swiper-slide contentTwo-4" >
            		<img src="img/car-content/car-page04/car-page-text01.png" class="ani" swiper-animate-effect="slideInLeft" swiper-animate-duration="0.3s" swiper-animate-delay="0.2s"/>
            		<img src="img/car-content/car-page04/car-page01.png" class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.4s" swiper-animate-delay="0.5s" />
            		<img src="img/car-content/car-page04/car-page02.png" class="ani" swiper-animate-effect="zoomIn" swiper-animate-duration="0.4s" swiper-animate-delay="0.9s" />
            		<img src="img/car-content/car-page04/car-page-text02.png" class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.4s" swiper-animate-delay="1.3s" />
            		<img src="img/one-font.png"/>
            </div>
            <div class="swiper-slide contentTwo-5" >
            		<img src="img/car-content/car-page05/car-page011.png" class="ani" swiper-animate-effect="fadeInLeft" swiper-animate-duration="0.4s" swiper-animate-delay="0.2s"/>
            		<img src="img/car-content/car-page05/car-page05.png" class="ani" swiper-animate-effect="fadeIn" swiper-animate-duration="0.4s" swiper-animate-delay="0.6s" />
            		<img src="img/car-content/car-page05/car-page02.png" class="ani" swiper-animate-effect="fadeInRight" swiper-animate-duration="0.4s" swiper-animate-delay="1s" />
            		<img src="img/one-font.png"/>
            </div>
            
            <!--留资页-->
            <div class="swiper-slide contentThree" id="go3">
            		<img src="img/go-back.png" class="ani kol-back" swiper-animate-effect="flash" swiper-animate-duration="0.4s" swiper-animate-delay="0.2s" />
            		<form id="userForm" >
			        <ul class="input-form">
			            <li class="litop3">
			            	<em></em>
			            	<img src="img/infom/icon-01.png" class="icon-01 icon"/>
			                <input   type="text" id="username" name="username" placeholder="请填写姓名"  maxlength=10 minlength=2 required="required" style="color: #FFFFFF;"/>
			            </li>
			            <li class="litop3">
			            	<em></em>
			            	<img src="img/infom/icon-02.png" class="icon-02 icon"/>
			            	<label>先生<input name="Fruit" type="radio" value="男" checked="checked" /> </label>
							<label>女士<input name="Fruit" type="radio" value="女"  /> </label>
			            </li>
			            <li class="litop3">
			            	<em></em>
			                <img src="img/infom/icon-03.png" class="icon-03 icon"/>
			                <input type="tel" id="phone" name="phone" placeholder="请填写手机" maxlength=11  required="required"  style="color: #FFFFFF;"/>
			            </li>
			            <li class="province-city">
			            	<em></em>
			            	<img src="img/infom/icon-04.png" class="icon-04 icon"/>
			                <select id="ddlProvince" name="ddlProvince" class="ddlProvince" title="省/00" >
			                    <option value="-1">选择省份</option>
			                </select>
			                <em class="select-icon select-province"></em>
			                <select id="ddlCity" name="ddlCity" class="ddlCity">
			                    <option value="-1">选择城市</option>
			                </select>
			                <!--<em class="select-icon"></em>-->
			            </li>
			            <li>
			            	<em></em>
			            	<img src="img/infom/icon-05.png" class="icon-05 icon"/>
							<select class="longselect" name="cartype" id="cartype">
								<option value="-1"  >意向车型</option>
								<option value="福特福睿斯">vv7C</option>
								<option value="全新福特福克斯">vv7s</option>
								
							</select>
			                <!--<em class="select-icon"></em>-->
			            </li>
			            <li>
			            	<img src="img/infom/text.png"/>
			            	<input type="checkbox" checked="checked" class="checkbox"  style=" color: blue;">
			            </li>
			            
			            <div id="submit" class="submit">
			            	<img src="img/infom/submit.png"/>
			            </div>
			        </ul>
					</form>
            </div>
        </div>
    <!--</div>-->
	    <div class="load-page" id="loadingPage">
			    <div class="img-load-now">
			        <!--加载动画-->
			        <div class="loading"><img src="img/loading.gif"/></div>
			        <div class="mask" id="img-loading-txt"></div>
			 
			    </div>
		</div>
	</body>
	<script src="js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/swiper.animate1.0.2.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/imagesloaded.pkgd.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/ChangeDealer.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/province.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/style.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/douyu_share.js" type="text/javascript" charset="utf-8"></script>	
	<script src="https://h5.xingyuanauto.com/weixin_serve/jssdk/js/jweixin-1.0.0.js"></script>
	<script src="js/wx_share.js" type="text/javascript" charset="utf-8"></script>
	
	
	<script type="text/javascript">
		var swiper = new Swiper('.swiper-container', {
		        pagination: '.swiper-pagination',
		        paginationClickable: true,
		        direction: 'vertical',
		          onInit: function(swiper){ //Swiper2.x的初始化是onFirstInit
		    swiperAnimateCache(swiper); //隐藏动画元素 
		    swiperAnimate(swiper); //初始化完成开始动画
		  }, 
		  onSlideChangeEnd: function(swiper){ 
		    swiperAnimate(swiper); //每个slide切换结束时也运行当前slide动画
		  }
    });
    $('.slide1').click(function(){
		swiper.slideNext();
		$('.ppp').addClass('pop');
	});
    $(".slide2").click(function(){
    	swiper.slideTo(3);
    });
    $(".slide3").click(function(){
    	swiper.slideTo(8);
    });
    $(".kol-back").click(function(){
    	swiper.slideTo(1);
    });
  
    var video = $('video');
    var videoW = video[0].videoWidth;
    
    //imgloading
    $("#container").imagesLoaded(function(){
    	
    })
    

	</script>
</html>
